{% extends 'base.html' %}
{% load mytags %}
{% block content %}
{% include 'nav_cat_bar.html' %}

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins" id="all">
                <div class="ibox-title">
                    <h5>资产详细信息列表</h5>
                    <div class="ibox-tools">
                        <a class="collapse-link">
                            <i class="fa fa-chevron-up"></i>
                        </a>
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                            <i class="fa fa-wrench"></i>
                        </a>
                        <a class="close-link">
                            <i class="fa fa-times"></i>
                        </a>
                    </div>
                </div>

                <div class="ibox-content">


                    <form id="asset_form">
                        <div class="col-sm-1" style="padding-left: 0">
                            <a href="{% url 'asset_add' %}" class="btn btn-sm btn-primary asset_add"> 添加资产 </a>
                        </div>


                        <div class="col-sm-4" style="padding-left: 0px">
                            <div class="">
                                <button type="button" class="btn btn-sm btn-success collapsed" data-toggle="collapse" data-target="#demo" aria-expanded="false">
                                   设置显示字段
                                </button>
                                <a id="asset_edit" type="button" class="btn btn-sm btn-warning ">修改</a>
                                <a id="asset_del"  class="btn btn-danger btn-sm asset_del" name="del_button"> 删除 </a>
                                <input type="button" id="asset_update" class="btn btn-info btn-sm iframe" name="update_button" value="批量更新" />
                            </div>
                        </div>
                        <div class="col-sm-6 col-sm-offset-1">
                            <label class="col-sm-4">
                               <select id="keyfield" class="form-control m-b input-sm" >
                                           <option value="">搜索字段</option>
                                           {% for field in model_fields  %}
                                               <option value="{{ field }}"> {{ model_fields|get_dict_value:field|slice:":20" }}</option>
                                           {% endfor %}
                               </select>
                           </label>
                            <div class="" style="padding-right: 0">
                             <div class="input-group inline-group">
                                <input type="text" class="form-control m-b input-sm" id="search_input" name="keyword" value="{{ keyword }}" placeholder="默认遍历所有字段搜索.">
                                <div class="input-group-btn">
                                    <button id='search_btn' href="{% url 'asset_list' %}?search=true" type="button" class="btn btn-sm btn-primary search-btn"  >
                                        - 搜索 -
                                    </button>
                                    {# <button type="button" href="{% url 'asset_list' %}?export=True" name="export" class="btn btn-sm btn-success search-btn-excel" onclick="return false">#}
                                    <button type="button" href="{% url 'asset_list' %}?export=true" name="export" class="btn btn-sm btn-success search-btn-excel" onclick="return false">
                                        - 导出 -
                                    </button>
                                </div>
                            </div>
                        </div>
                        </div>
                        <div id="demo" class="collapse" aria-expanded="false" style="height: 0px;">
                          {# <div class="well well-sm" id="set_display_field">#}
                          <div class="" id="set_display_field">
                              {% for field  in  field_mapped %}
                                <button type="button" class="btn btn-sm btn-default" id="{{ field }}"> {{ field_mapped|get_dict_value:field }} </button>
                              {% endfor %}
                          </div>
                        </div>
                        <div id="export"></div>
                        <table class="table table-striped table-bordered table-hover " id="editable" name="editable">
                            <thead>
                                <tr>
                                    <th class="text-center">
                                        <input id="checkall" type="checkbox" class="i-checks" name="checkall" value="checkall" data-editable='false' onclick="check_all('asset_form')">
                                    </th>
                                    <th class="text-center" id="it_id" > 编号 </th>
                                    {% for field in field_mapped %}
                                        <th class="text-center {{ field }}" style="display:none"> {{ field_mapped|get_dict_value:field }} </th>
                                    {% endfor %}
                                    <th class="text-center" id="it_detail"> 详细信息 </th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for asset in assets.object_list %}
                                <tr class="gradeX">
                                    <td class="text-center" name="it_id" value="{{ asset.it_id }}" data-editable='false'>
                                        <input name="id" value="{{ asset.it_id }}" type="checkbox" class="i-checks">
                                    </td>
                                    <td class="text-center"> {{ asset.it_id|default_if_none:"" }} </td>
                                    {% for field in  field_mapped.keys %}
                                        {% if 'time' in field %}
                                            <td class="text-center {{ field }}" style="display:none" > {{ asset | get_obj_value:field|date:"Y-m-d H:i:s" }} </td>
                                            {# <td class="text-center {{ field }}" style="display:none" > {{ asset | get_obj_value:field | date:"Y-m-d H:i:s" }} </td>#}
                                        {% else %}
                                            <td class="text-center {{ field }}" style="display:none" > {{ asset | get_obj_value:field | default_if_none:"" }} </td>
                                        {% endif %}
                                    {% endfor %}
                                    <td class="text-center">
                                        <a value="{% url 'asset_detail' %}?it_id={{ asset.it_id }}" type="button" class="btn btn-sm btn-danger iframeDetail">查看详情</a>
                                    </td>
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                        <div class="row">
                            <div class="col-sm-6">
                            {% comment %}
                                <input type="button" id="asset_del" class="btn btn-danger btn-sm" name="del_button" value="删除" />
                                <a value="{% url 'asset_edit_batch' %}" type="button" class="btn btn-sm btn-warning iframe">修改</a>
                                <input type="button" id="asset_update" class="btn btn-info btn-sm" name="update_button" value="更新" />
                                {# <input type="button" id="asset_update_all" class="btn btn-primary btn-sm" name="update_button" value="更新全部" /> #}
                            {% endcomment %}
                        </div>
                            {% include 'paginator.html' %}
                        </div>

                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}
{% block self_footer_js %}
<script>
$(document).ready(function(){
    // 隐藏侧边栏
    $("body").toggleClass("mini-navbar");
    $("[for='collapsemenu']").click();
    // 初始化显示的字段
    {% for f in default_display_field %}
        $('#set_display_field #{{ f }}').toggleClass("btn-default btn-success active");
        $('.{{ f }}').attr('style','');
    {% endfor %}

    try{
        //初始或搜索字段
        var ParamGet = urlParamGet();

        keyword = ParamGet['keyword'];
        keyfield = ParamGet['keyfield'];
        if (keyfield) $("#keyfield option[value='" + keyfield + "']").attr("selected",true);
        if (keyword) $("#search_input").val(keyword);
    }catch(err){
        // console.log(err);
    }
 });

$(".iframeDetail").on('click', function() {
  var url = $(this).attr("value");
 //  alert(url);
  parent.layer.open({
      type: 2,
      title: '详细信息',
      maxmin: true,
      shift: 'top',
      border: [2, 0.3, '#1AB394'],
      shade: [0.5, '#000000'],
      area: ['50%', '100%'],
      shadeClose: true,
      content: url,
      cancel: function() {
          location.replace(location.href);
      }
  });
});


$("#asset_del").on('click', function(){
         var asset_id_all = getIDall();
         console.log(asset_id_all);
         if (asset_id_all == ''){
             layer.open({
                 content: '请至少选择一行.'
             });
             return false;
         }
         layer.confirm('确定删除？', {icon: 3, title:'提示'}, function(index){
           if (1 == index){
               $.ajax({
                   type: "post",
                   data: {
                       asset_id_all: asset_id_all,
                       // csrf token
                       csrfmiddlewaretoken: '{{ csrf_token }}'
                   },
                   url: "{% url 'asset_del' %}?arg=batch",
                   success: function(data) {
                       layer.open({
                           content: data
                       });
                       parent.location.reload();
                   }
               });
           }
          layer.close(index);
         });
});

$("#asset_edit").on('click',function(){
    var checked = $(".gradeX input:checked")
    if (0 == checked.length){
        layer.open({
            content: '请选择修改项.'
        });
        return ;
    }else if (1 < checked.length){
        layer.open({
            content: '目前仅支持单个条目修改.'
        });
        return;
    }else{
        var id = checked.val();
        // console.log("{% url 'asset_edit' %}?it_id=" + id);
        // window.location = "{% url 'asset_edit' %}?it_id=" + id;
        parent.layer.open({
            type: 2,
            title: '信息修改',
            maxmin: true,
            shift: 'top',
            border: [2, 0.3, '#1AB394'],
            shade: [0.5, '#000000'],
            area: ['63%', '100%'],
            shadeClose: true,
            content: "{% url 'asset_edit' %}?it_id=" + id,
            cancel: function() {
                location.replace(location.href);
            }
        });
    }

})


$("#asset_update").on('click', function(){
    var asset_id_all = getIDall();
    var keyfield = $('#keyfield').val();
    var keyword = $('#search_input').val();
    var params = {'keyfield':keyfield,'keyword':keyword};
    var params_str = $.param(params);


    layer.confirm("注意：目前仅支持根据过滤条件来批量修改,暂不支持勾选特定项进行批量修改.使用请务必小心.",{icon :5 ,title: "警告"},function(index){
        parent.layer.open({
            type: 2,
            title: '批量修改信息',
            maxmin: true,
            shift: 'top',
            border: [2, 0.3, '#1AB394'],
            shade: [0.5, '#000000'],
            area: ['800px', '600px'],
            shadeClose: true,
            content: "{% url 'asset_update' %}?" + params_str,
            cancel: function(){
                location.replace(location.href);
            }
        });
        layer.close(index);
});
});

$('#search_btn').on('click',function(){
    var keyfield = $('#keyfield').val();
    var keyword = $('#search_input').val();
    console.log(keyfield + ' : ' + keyword);
    var params = {'keyfield':keyfield,'keyword':keyword};
    var params_str = $.param(params);
    // window.location = "{% url 'asset_list' %}?keyfield=" + keyfield + '&keyword=' + keyword;
    window.location = "{% url 'asset_list' %}?" + params_str;
})

$('.search-btn-excel').unbind('click').bind('click',function(){
    var url= $(this).attr("href");
    $.ajax({
        type: "GET",
        url: url,
        data: $("#asset_form").serialize(),
        success: function (data) {
            $("#export").html(data);
        }
    });
});

$('#set_display_field button').on('click',function(){
    $(this).toggleClass("btn-default btn-success active");
    var field_id = $(this).attr('id');
    if ($(this).hasClass('active')){
        $('.' + field_id).attr('style','');
    }else{
        $('.' + field_id).attr('style','display:none');
    }
})


</script>

{% endblock %}
